<@override name="content">
<div class="pagination pagination-centered">
  <div class="pull-left">
    <a href="contest/recent" class="btn btn-success">Recent Contests</a>
    <#if adminUser??><a href="contest/add" class="btn btn-info">Add a contest</a></#if>
    <!-- <form class="form-search" action="contest/search" method="post">
      <div class="input-append">
        <input type="text" class="input-medium search-query" name="word" placeholder="Search Contest">
        <button type="submit" class="btn btn-info">Search</button>
      </div>
    </form> -->
  </div>
  <#include "../common/_paginate.html" />
  <@paginate currentPage=contestList.pageNumber totalPage=contestList.totalPage actionUrl="contest/" />
  <div class="pull-right">
    <div class="btn-group btn-group1" data-toggle="buttons-radio">
      <a href="/contest" type="button" class="btn btn-small<#if status==-1> active</#if>">All</a>
      <a href="/contest?status=0" type="button" class="btn btn-small<#if status==0> active</#if>">Pending</a>
      <a href="/contest?status=1" type="button" class="btn btn-small<#if status==1> active</#if>">Running</a>
      <a href="/contest?status=2" type="button" class="btn btn-small<#if status==2> active</#if>">Finished</a>
    </div>
    <span class="badge badge-info">${contestList.pageNumber}/${contestList.totalPage} Pages</span>
    <span class="badge badge-info">${contestList.totalRow} Contests</span>
  </div>
</div>

<table id="Contest-list" class="table table-hover table-condensed">
  <thead>
  <tr>
    <th>ID</th>
    <th>Title</th>
    <th>Start Time</th>
    <th>End Time</th>
    <th>Access</th>
    <th>Status</th>
  </tr>
  </thead>
  <tbody>
    <#if contestList??>
      <#list contestList.list as Contest>
      <tr>
        <td><a href="contest/show/${Contest.cid!}">${Contest.cid!}</a></td>
        <td><a href="contest/show/${Contest.cid!}">${Contest.title!}</a></td>
        <td class="time">${Contest.startDateTime!}</td>
        <td class="time">${Contest.endDateTime!}</td>
        <td class="${Contest.ctype!} type-${Contest.type!}">${Contest.ctype!}</td>
        <td class="${Contest.cstatus!}">${Contest.cstatus!}</td>
      </tr>
      </#list>
    </#if>
  </tbody>
</table>
<span class="time" id="current"></span>
</@override>

<@override name="scripts">
<link href="assets/tablecloth/css/tablecloth.css" type="text/css" rel="stylesheet">
<script src="assets/tablecloth/js/jquery.metadata.js"></script>
<script src="assets/tablecloth/js/jquery.tablesorter.min.js"></script>
<script src="assets/tablecloth/js/jquery.tablecloth.js"></script>

<script type="text/javascript">
  $(document).ready(function () {
    document.onkeydown = nextpage;
    clock(function (current_time) {
      $("#current").html(new Date(current_time).format("yyyy-MM-dd hh:mm:ss"));
    }, 1000);

    var prevpage = "/contest/${contestList.pageNumber-1}<#if contestList.pageSize!=pageSize>-${contestList.pageSize}</#if>"
    var nextpage = "/contest/${contestList.pageNumber+1}<#if contestList.pageSize!=pageSize>-${contestList.pageSize}</#if>"
    function nextpage(event) {
      event = event ? event : (window.event ? window.event : null);
      <#if (contestList.pageNumber>1)>if (event.keyCode == 37)location = prevpage;</#if>
      <#if contestList.pageNumber<contestList.totalPage>if (event.keyCode == 39)location = nextpage;</#if>
    }

    <#if oj_style != "slate">
      $("#Contest-list").tablecloth({
        theme: "stats",
        condensed: true,
        sortable: true,
        striped: true,
        clean: true
      });
    </#if>
  });
</script>
</@override>
<@extends name="../common/_layout.html" />
